<script setup>
import { inject, ref } from "vue";
import { onLoad, onReachBottom } from "@dcloudio/uni-app";
import { mine, userinfo, upAreaApi } from "@/services/user";
import { des_phone } from "@/utils/desensitization";

onLoad((e) => {
  type.value = e.type || "";
  userinfofun();
  upAreafun();
});

const type = ref("");

const identitylevel = ref("");
const area = ref(0);
const level = ref(0);
const userinfofun = async () => {
  let res = await userinfo();
  identitylevel.value = res.data.area_code_text;
  area.value = res.data.area;
  level.value = res.data.level;
};

const superior = ref({});
const upAreafun = async () => {
  let res = await upAreaApi();
  superior.value = res.data;
};

const goteam = () => {
  uni.navigateTo({
    url: "/pages/team/shopkeeper/areaTeam?level=" + area.value.level,
  });
};
const goOpen = () => {
  uni.navigateTo({
    url: "/pages/team/shopkeeper/quotaVoucher?type=" + area.value.level,
  });
};

const callphone = (phoneNumber) => {
  // 判断手机是否支持拨打电话功能
  if (uni.canIUse("makePhoneCall")) {
    uni.makePhoneCall({
      phoneNumber: phoneNumber, // 电话号码
      success: function () {},
      // fail: function () {
      //   uni.showToast({
      //     title: "拨打电话失败",
      //     icon: "error",
      //   });
      // },
    });
  } else {
    uni.showToast({
      title: "你的设备不支持拨打电话功能",
      icon: "none",
    });
  }
};
</script>

<template>
  <view class="area">
    <view class="area-list">
      <view class="area-list-item">
        <view class="my-title">我的代理</view>
        <view class="my-info">
          <view class="my-info-text-left">
            <text>身份等级：</text>
            <view
              :class="
                area.level == 1
                  ? 'provincelevel'
                  : area.level == 2
                  ? 'citylevel'
                  : area.level == 3
                  ? 'identitylevel'
                  : ''
              "
              >{{
                area.level == 1
                  ? "省级独家代理"
                  : area.level == 2
                  ? "市级独家代理"
                  : area.level == 3
                  ? "区级独家代理"
                  : level.name
              }}</view
            >
          </view>
        </view>
        <view class="my-info-text-right">
          <text>代理区域：</text>
          <text>{{ identitylevel ? identitylevel : "---" }}</text>
        </view>
      </view>
      <u-line length="85%" class="notuse-line" color="#E5E5E5"></u-line>
      <view class="area-list-item">
        <view class="my-title">我的上级代理</view>
        <view class="my-info">
          <view class="my-info-text-left">
            <text>姓名：</text>
            <text>{{ superior.name ? superior.name : "---" }}</text>
          </view>
        </view>

        <view class="phone">
          手机：{{ des_phone(superior.phone ? superior.phone : "---") }}
          <text class="phone-click" @click="callphone(superior.phone)"
            >拨打</text
          >
        </view>
        <view class="my-info-text-right">
          <text>代理区域：</text>
          <text>{{
            superior.area_code_text ? superior.area_code_text : "---"
          }}</text>
        </view>
      </view>

      <view class="area-list-item" v-if="type == 1 || type == 2">
        <u-line length="85%" class="notuse-line" color="#E5E5E5"></u-line>
        <view class="my-title">
          我的区级团队
          <view class="my-title-text" @click="goteam">
            查看团队
            <u-icon name="arrow-right" color="#8C8C8C" size="16"></u-icon>
          </view>
        </view>
      </view>
    </view>
  </view>
  <!-- <view class="bt-footer">
    <view class="bt-wz">
      <u-button
        class="custom-style"
        @click="goOpen"
        text="为他人开通"
      ></u-button>
    </view>
  </view> -->
</template>

<style lang="scss" scoped>
@import "./area.scss";
</style>
